import { defineStore } from 'pinia'
import { MenuListType } from '@/types/menu'

// 固定的仪表盘菜单项
const FIXED_DASHBOARD_MENU: MenuListType = {
  id: 0,
  path: '/dashboard',
  name: 'Dashboard',
  component: null,
  meta: {
    title: '监控中心',
    title_en: 'Dashboard',
    icon: '&#xe721;', // 仪表盘图标
    isHide: false
  },
  children: [
    {
      id: 1,
      path: '/dashboard/console',
      name: 'Console',
      component: () => import('@views/dashboard/console/index.vue'),
      meta: {
        title: '工作台',
        title_en: 'Workbench',
        icon: '&#xe755;',
        keepAlive: false
      }
      // },
      // {
      //   id: 2,
      //   path: '/dashboard/analysis',
      //   name: 'Analysis',
      //   component: () => import('@views/dashboard/analysis/index.vue'),
      //   meta: {
      //     title: '分析页',
      //     title_en: 'Analysis',
      //     icon: '&#xe763;',
      //     keepAlive: false
      //   }
    }
  ]
}

interface MenuState {
  menuList: MenuListType[]
  menuWidth: string
}

export const useMenuStore = defineStore({
  id: 'menuStore',
  state: (): MenuState => ({
    menuList: [],
    menuWidth: ''
  }),
  getters: {
    getMenuList(): MenuListType[] {
      // 始终将仪表盘放在第一位
      const otherMenus = this.menuList.filter((menu) => menu.path !== '/dashboard')
      return [FIXED_DASHBOARD_MENU, ...otherMenus]
    }
  },
  actions: {
    setMenuList(list: []) {
      // 过滤掉原有的仪表盘菜单，使用固定的仪表盘菜单
      const otherMenus = list.filter((menu: any) => menu.path !== '/dashboard')
      this.menuList = otherMenus
    },
    setMenuWidth(width: string) {
      this.menuWidth = width
    }
  }
})
